/* =========================================
   MOBİL FİLTRE PANELİ
   Sadece mobil görünüm için
========================================= */

.mobile-filter-btn,
.mobile-filter-close,
.mobile-filter-overlay{
    display:none;
}

@media (max-width: 991px){

    /* Mobil filtre açma butonu */
    .mobile-filter-btn{
        display:flex;
        align-items:center;
        justify-content:center;
        gap:8px;

        width:100%;
        height:48px;
        margin:16px 0 24px;

        border:0;
        border-radius:6px;

        background:#386c9b;
        color:#fff;

        font-size:14px;
        font-weight:700;
        cursor:pointer;
    }

    .mobile-filter-btn::before{
        content:"≡";
        font-size:16px;
        line-height:1;
    }

    /* Arka plan karartma */
    .mobile-filter-overlay{
        display:block;
        position:fixed;
        inset:0;

        background:rgba(0,0,0,.55);
        opacity:0;
        visibility:hidden;

        z-index:9997;
        transition:.25s ease;
    }

    .mobile-filter-overlay.active{
        opacity:1;
        visibility:visible;
    }

   .urun-filter{
    position:fixed !important;
    top:0;
    left:-100%;

    width:78%;
    max-width:330px;
    height:100vh;

    background:#fff;
    z-index:9998;

    padding:22px 20px 90px;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;

    transition:left .28s ease;
    box-shadow:8px 0 30px rgba(0,0,0,.22);
}

.urun-filter.active{
    left:0;
}

    /* Filtre başlığı */
    .urun-filter .filter-title{
        display:flex;
        align-items:center;
        justify-content:space-between;

        margin-bottom:22px;
        padding-bottom:14px;

        border-bottom:1px solid #e5e5e5;
    }

    .urun-filter .filter-title span{
        font-size:18px;
        font-weight:800;
        color:#163b5c;
    }

    /* X kapatma butonu */
    .mobile-filter-close{
        display:flex;
        align-items:center;
        justify-content:center;

        width:32px;
        height:32px;

        border:0;
        background:transparent;

        font-size:28px;
        line-height:1;
        color:#999;
        cursor:pointer;
    }

    /* Filtre blokları */
    .urun-filter .filter-item{
        margin-bottom:24px;
        padding-bottom:18px;
        border-bottom:1px solid #f0f0f0;
    }

    .urun-filter .filter-header{
        position:relative;

        margin-bottom:14px;

        font-size:13px;
        font-weight:800;
        color:#386c9b;
        letter-spacing:.4px;
        text-transform:uppercase;
    }

    .urun-filter .filter-header::after{
        content:"⌃";
        position:absolute;
        right:0;
        top:0;

        font-size:13px;
        color:#386c9b;
    }

    /* Marka linkleri */
    .urun-filter .brand-list div{
        margin-bottom:14px;
    }

    .urun-filter .brand-list a,
    .urun-filter .filter-content a{
        display:block;

        color:#222;
        font-size:14px;
        font-weight:500;
        text-decoration:none;
    }

    /* Checkbox alanları */
    .urun-filter .filter-content label{
        display:flex;
        align-items:center;
        gap:10px;

        min-height:32px;
        margin-bottom:10px;

        font-size:14px;
        font-weight:600;
        color:#333;

        cursor:pointer;
    }

    .urun-filter .filter-content input[type="checkbox"]{
        width:15px;
        height:15px;
        accent-color:#386c9b;
        cursor:pointer;
    }

    .urun-filter .filter-content span{
        line-height:1.3;
    }

    /* Select */
    .urun-filter .filter-select{
        width:100%;
        height:42px;

        border:1px solid #ddd;
        border-radius:4px;

        padding:0 10px;

        font-size:14px;
        color:#333;
        background:#fff;
    }

    /* Uygula butonu */
    .urun-filter .filter-btn{
        position:sticky;
        bottom:0;

        width:100%;
        height:46px;

        margin-top:10px;

        border:0;
        border-radius:6px;

        background:#386c9b;
        color:#fff;

        font-size:13px;
        font-weight:800;
        letter-spacing:.3px;

        cursor:pointer;
    }

    /* Scroll daha temiz görünsün */
    .urun-filter::-webkit-scrollbar{
        width:4px;
    }

    .urun-filter::-webkit-scrollbar-thumb{
        background:#c7c7c7;
        border-radius:10px;
    }

    /* Panel açıkken sayfa kaymasın */
    body.mobile-filter-open{
        overflow:hidden;
    }
}